@mixin f-border($f-color) {
  border-color: $f-color !important;
}

@mixin f-text($f-color) {
  color: $f-color !important;
}

@mixin f-background($f-color) {
  background: $f-color !important;
}

// 选择类型
@mixin f-selectProp($f-type, $f-color) {
  @if $f-type=="text" {
    @include f-text($f-color);
  }

  @else if $f-type=="border" {
    @include f-border($f-color);
  }

  @else {
    @include f-background($f-color);
  }
}


@mixin f-action($f-color, $f-propType: '', $f-actionType: '') {
  $f-type: 'color';

  //确定属性
  @if $f-propType=='bg' {
    $f-type: 'background';
  }

  @else if $f-propType=='border' {
    $f-type: 'border-color';
  }

  // 区分交互类型

  @if $f-actionType=='hover' {

    &:hover,
    &.f-state-hover {
      #{$f-type}: $f-color !important;
    }
  }

  @else if $f-actionType=='active' {
    &:active {
      #{$f-type}: $f-color !important;
    }
  }

  @else if $f-actionType=='disabled' {

    &:disabled,
    &.f-state-disabled,
    &.disabled {
      #{$f-type}: $f-color !important;
    }
  }

  @else if $f-actionType=='selected' {

    &.active,
    &.f-state-selected {
      #{$f-type}: $f-color !important;
    }
  }

  @else if $f-actionType=='cursor' {
    $f-actionColorLength: length($f-color);

    #{$f-type}: nth($f-color, 1) !important;

    @if $f-actionColorLength==2 {
      &:hover {
        #{$f-type}: nth($f-color, 2) !important;
      }
    }

    @else {
      &:hover {
        #{$f-type}: nth($f-color, 2) !important;
      }

      &:active {
        #{$f-type}: nth($f-color, 3) !important;
      }
    }
  }

  @else if $f-actionType=='changeDisabled' {
    #{$f-type}: nth($f-color, 1) !important;

    &:disabled,
    &.f-state-disabled,
    &.disabled {
      #{$f-type}: nth($f-color, 2) !important;
    }
  }
}

/*******************************
     图标、文字变量-相关样式生成
*******************************/
@mixin f-common($f-prefix, $f-icon, $f-propType: "text") {

  @each $f-gType,
  $f-gInfo in $f-icon {

    // $f-gType=>"action "
    // $f-gInfo=> ("01":("cursor":($f-theme-03,$f-theme-05,$f-theme-01))
    @each $f-gCode,
    $f-gColor in $f-gInfo {

      // $f-gCode=>"01"
      // $f-gColor=>("cursor":($f-theme-03,$f-theme-05,$f-theme-01)
      @if $f-gType=='default' {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-selectProp($f-propType, $f-gColor);
        }
      }

      @else if $f-gType=='action' {

        @each $f-gActionType,
        $f-gActionInfo in $f-gColor {
          .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
            @include f-action($f-gActionInfo, $f-propType, $f-gActionType);
          }
        }
      }

      @else {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-action($f-gColor, $f-propType, $f-gType);
        }
      }
    }
  }
}

/*******************************
     语义变量-相关样式生成
*******************************/
@mixin f-semantic($f-prefix, $f-semantic) {

  @each $f-gType,
  $f-gInfo in $f-semantic {

    @each $f-gCode,
    $f-gColor in $f-gInfo {
      @if $f-gType=='bg' {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-background($f-gColor);
        }
      }

      @else if $f-gType=='text' {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-text($f-gColor);
        }
      }

      @else if $f-gType=='icon' {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-text($f-gColor);
        }
      }

      @else if $f-gType=='border' {
        .fp-#{$f-prefix}-#{$f-gType}-#{$f-gCode} {
          @include f-border($f-gColor);
        }
      }
    }
  }

}